<template>
	<custom-layout custom-class="custom-layout">
		<!-- 表单 -->
		<wd-form ref="formRef" :model="formData">
			
			<wd-cell-group border>
				<wd-collapse v-model="value" class="list">
				  <wd-collapse-item
				    v-for="_ in dictionaryStore.get('decoration_design_order_measure_class')"
				    :key="_.value"
				    :title="_.label"
				    :name="`measureInfo${_.value}`"
				  >
				    <upload v-model="formData.secondTypeFileUrl[_.value]" accept="image/*" multiple theme="image"></upload>
				  </wd-collapse-item>
				</wd-collapse>
				<wd-cell title="实际面积(㎡)" prop="actualArea" :rules="[{required:true,message:'请输入实际面积(㎡)'}]"  title-width="33%"
									>
									<wd-input-number v-model="formData.actualArea"  input-width="100px"
													 :min="0" :precision="2"
														 />
									
								</wd-cell>
				
				<wd-textarea v-model="formData.remark" prop="remark" label="备注" auto-height placeholder="请输入备注"
					clearable :rules="[{required:true,message:'备注'}]"  />
				
			
			
				
			</wd-cell-group>
				
				
				
				
			
		</wd-form>
		<!-- 提交 -->
		<wd-button block size="large" custom-class="submit-button" @click="handleSubmit">提交</wd-button>
		
	</custom-layout>
</template>

<script setup>
	import {
		reactive,
		ref
	} from 'vue';
	import {
		onLoad
	} from '@dcloudio/uni-app'
	import {
		useDictionaryStore,
		useUserStore
	} from '@/store/index.js'
	import {
		createDesignInfo,
	} from '@/api/order/detail.js'
	import Upload from '@/packageA/components/upload/upload.vue';
	// 字典仓库
	const dictionaryStore = useDictionaryStore()
	// 用户仓库
	const userStore = useUserStore()
	const value = ref(['measureInfo1'])
	// 表单ref
	const formRef = ref()
	// 表单数据
	const formData = reactive({
		secondTypeFileUrl: {}
	})
	const orderId = ref()
	onLoad((option)=>{
		orderId.value = option.orderId
		dictionaryStore.get('decoration_design_order_measure_class').forEach(item => {
  		  formData.secondTypeFileUrl[item.value] = []
  		})
		
	})
	// 处理提交
	const handleSubmit = async () => {
		const validateResult = await formRef.value.validate()
		if (!validateResult.valid) return
		uni.showLoading({
			mask: true
		})
		const params = {
			...formData,
			logType: 'measure',
			orderId:orderId.value
		}
		createDesignInfo(params).then(()=>{
			uni.navigateBack(); // 返回上一页
			uni.$emit('refresh-record-list'); // 触发刷新线索列表
			
		}).catch((error) => {
			setTimeout(() => {
				uni.showToast({
					title: error,
					icon: 'error'
				})
			})
		}).finally(() => {
			uni.hideLoading()
			
		})
		
	}
	
</script>

<style lang="scss" scoped>
	// 自定义布局
	:deep(.custom-layout) {
		background: #F8F8F8;
	}

	// 提交按钮
	:deep(.submit-button) {
		margin: 32rpx;
	}
	.cell-title {
		font-size: 30rpx;
		font-weight: bold;
		margin: 24rpx;
		padding-left: 10rpx;
		position: relative;
	}
	.cell-title:before {
		content: "";
		position: absolute;
		left: -2px;
		top: 15%;
		height: 70%;
		width: 6rpx;
		background-color: #6a9cff;
	}
</style>